@import url('~@/style/var.less');
@import url('~@/style/mixin.less');

.showMessage {
    .self-center();

    padding: 15px 20px;
    border-radius: 10px;
    background-color: @success;

    color: #fff;
    white-space: nowrap;

    box-shadow: 0px 2px 7px 2px #555;

    transform: translate(-50%, -50%) translateY(25px);
    opacity: 0;

    transition: .5s;

    span {
        margin-left: 8px;
    }

    &-info {
        background-color: @primary;
    }

    &-success {
        background-color: @success;
    }

    &-warn {
        background-color: @warn;
    }

    &-error {
        background-color: @danger;
    }
}